import { createApp } from 'vue'
import { createPinia } from 'pinia'
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import piniaPluginPersist from 'pinia-plugin-persist'
import 'normalize.css/normalize.css'
import 'element-plus/theme-chalk/src/message.scss'
import 'element-plus/theme-chalk/src/message-box.scss'
import 'element-plus/theme-chalk/el-overlay.css'
import '@/assets/css/index.css'
import App from './App.vue'
import router from './router'
const app = createApp(App)

import VMdPreviewHtml from '@kangc/v-md-editor/lib/preview-html';
import '@kangc/v-md-editor/lib/style/preview-html.css';

// 引入使用主题的样式
import '@kangc/v-md-editor/lib/theme/style/vuepress.css';
import hljs from 'highlight.js';
// VMdPreview.use(githubTheme, {
//     Hljs: hljs,
//   });

// app.use(VMdPreview)
// import hljs from 'highlight.js' //导入代码高亮文件
// import 'highlight.js/styles/monokai-sublime.css'  //导入代码高亮样式
// //自定义一个代码高亮指令
// app.directive('highlight', function (el) {
//     const blocks = el.querySelectorAll('pre code');
//     blocks.forEach((block: any) => {
//         hljs.highlightBlock(block)
//     })
// })

// import 'highlight.js/styles/atom-one-dark.css'
// import 'highlight.js/lib/common'
// import hljsVuePlugin from '@highlightjs/vue-plugin'
// //注册组件
// app.use(hljsVuePlugin)


// import hljs from "highlight.js/lib/core";
// import java from "highlight.js/lib/languages/java"; //引入语言
// hljs.registerLanguage("java", java);
// import  './hljs.ts'
// import hljsVuePlugin from "@highlightjs/vue-plugin";
// import "highlight.js/styles/stackoverflow-light.css";
import 'highlight.js/styles/atom-one-dark.css'
// import "highlight.js/lib/common";
// app.component("hljsVuePlugin", hljsVuePlugin);//全局注册
// app.use(hljsVuePlugin)


import * as Icons from '@element-plus/icons-vue'
Object.keys(Icons).forEach((key) => {
    app.component(key, Icons[key as keyof typeof Icons]);
})

// element
import Table from '@/components/ElementCom/table.vue'
import Pagination from '@/components/ElementCom/table-pagination.vue'
import SearchBar from '@/components/ElementCom/table-searchBar.vue'
import Notice from '@/components/header/notice.vue'
import Header from '@/components/header/header.vue'
app.component('Table', Table)
app.component('Pagination', Pagination)
app.component('SearchBar', SearchBar)
app.component('Notice', Notice)
app.component('Header', Header)
app.use(ElementPlus, {
    locale: zhCn,
})

app.use(VMdPreviewHtml);

const store = createPinia()
store.use(piniaPluginPersist)
app.use(store)
app.use(router)

app.mount('#app')